<template>
  <div>
    <main-layout>
      <div class="list-container">
        <auth-tag code="11001" tips="无权访问">
          <vTable   ref="vGridTable" v-if="pdata"
                :columnsList="columnsList"
                apiUrl="boss/notify/sys-notify-list"
                :pageSize="15"
                :formConfig="formConfig"
                :toolbarConfig="false"
                :queryData="{
                  companyId:userStore.userInfo.companyId,
                  farmId:userStore.userInfo.farmId}">
                <template #actions="{row}">
                  <auth-tag code="11002">
                     <el-button type="text" icon="view" class="btn-view" size="small" @click="goDetail(row.notifyId)">详情</el-button>
                  </auth-tag>
                  </template>
            </vTable>
        </auth-tag>
      </div>
    </main-layout>
  </div>
</template>
<script setup name="System-Account-List">
import { nextTick, ref, watch, onActivated, reactive, computed,onMounted } from 'vue'
import { useRouter } from 'vue-router'
import mainLayout from '@/components/custom/mainLayout.vue'
import { useUserStore } from '@/pinia/modules/user'
const router = useRouter()
const userStore = useUserStore()
const pdata =ref(false)
onMounted(()=>{
  const curFarm = userStore.userInfo.farmList.find(item => item.farmId == userStore.userInfo.farmId)
  if(curFarm){
    pdata.value =  {province:curFarm.province,city:curFarm.city,area:curFarm.district}
  }
})

const  formConfig = computed(
    ()=>{
    return {
        titleWidth: 100,
        titleAlign: 'center',
        items: [
        {
            field: 'title',
            title: '标题',
            span: 5,
            itemRender: {name: '$input', props: {placeholder: '请输入标题', clearable: true}}
          },
          {
          field: 'isSend',
          title: '状态',
          span: 5,
          itemRender: {
            name: '$select',
            props: {
              placeholder: '请选择',
              clearable: true,
              options: [
                {label: '已发送', value:1},
                {label: '未发送', value:0}
              ]
            }
          }
        },
          {
            field: 'dateRange',
            title: '创建时间',
            span: 5,
            slots: { default: 'dateRange' },
            itemRender:{}
          },
          {
            align: 'center', collapseNode: false,
            itemRender: {
              name: '$buttons',
              children: [
                {props: {type: 'submit', icon: 'vxe-icon-search', content: '查询', status: 'primary'}},
                {props: {type: 'reset', icon: 'vxe-icon-refresh', content: '重置'}}
              ]
            }
          }
        ]
    }
})

const columnsList = ref([
      {type: 'seq', title: '序号',width:'60',align:'center'},
      {field: 'title', title: '标题',minWidth:'110',align:'center'},
      {field: 'notifyType', title: '类型',minWidth:'130',align:'center',slots:{
        default:({row})=>{
          return [row.notifyType==1?'农事提醒':(row.notifyType==2?'气象通知':'农事建议')]
        }
      }},
      {field: 'createTime', title: '通知日期',minWidth:'110',align:'center'},
      {title: '操作', width: 240,fixed:'right', slots: {default: 'actions'}}
   ])

const goDetail=(notifyId)=>{
  router.push(`/warning/detail?id=${notifyId}`)
}

</script>

<style lang="scss" scoped>
.inputLine {
  display: flex;
  width: 300px;
  .zhi{
    padding: 0 10px;
  }
  s{
    font-style: normal;
    text-decoration: none;
    padding: 0 0 0 5px;
    color: var(--el-text-color-regular);
  }
}
</style>
